<%-- 
    Document   : BookTour
    Created on : Nov 1, 2011, 11:24:24 PM
    Author     : MrKoi
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>East2West Tours and Travels</title>
        <script src="js/datetimepicker_css.js"></script>  
        <script type="text/javascript">
	$(document).ready(function(){
	
	var form=$("#bookTour");
	var startdate=$("#startdate");
	var startdateInfor=$("#startdateInfor");
	var enddate=$("#enddate");
	var enddateInfor=$("#enddateInfor");
	
	startdate.blur(validStartDate);
	startdate.keyup(validStartDate);	
	enddate.blur(validEndDate);
	enddate.keyup(validEndDate);	
			
	form.submit(function(){
				if(validStartDate() & validEndDate()){
						return true;
					}
					else{
						return false;

					}
			 });
			 
			 function validStartDate()
			 {
			  if(startdate.val()==""){
						startdate.addClass("error");
						startdateInfor.text("Choose start date");
						startdateInfor.addClass("error");
						return false;
					}
					else{
					   startdate.removeClass("error");
						startdateInfor.text("");
						startdateInfor.removeClass("error");
						return true;
					}
			 }
			 
			 function validEndDate()
			 {
			  if(enddate.val()==""){
						enddate.addClass("error");
						enddateInfor.text("Choose end date");
						enddateInfor.addClass("error");
						return false;
					}
					else{
					   enddate.removeClass("error");
						enddateInfor.text("");
						enddateInfor.removeClass("error");
						return true;
					}
			 }
			 
			 
	
	});
	
        </script>
        
        
    </head>
    <style type="text/css">
        
        .style1 {color: #3366FF}
        #error{
        margin-bottom: 20px;
        border: 1px solid #efefef;
        }
        #bookTour input{
        width: 200px;	
        
        font-size: 10px;
        }
              
        #bookTour input.error{
        background: #f8dbdb;
        border-color: #e77776;
        }
        #bookTour span{
        margin-left: 10px;
        color: #6f9ff1;
        font-size: 11px;
        font-style: italic;
        }
        #bookTour span.error{
        color: #e46c6e;
        }
        #bookTour #send{
      
        color: #fff;      
       
        border: 0;
        cursor: pointer;
        text-align:center;
        }
    </style>
    <%
    String user="";
    String nametour="";
    String pirceAdult="";
    String priceChild="";
    String idtour="";
    if(session.getAttribute("User")!=null) {
        user=(String)session.getAttribute("User");
        nametour=request.getParameter("name").toString();
        pirceAdult=request.getParameter("ap").toString();
        priceChild=request.getParameter("cp").toString();
        idtour=request.getParameter("idTour").toString();
        
        
    } else {
       
        out.println("<script>alert('Please login before book tour !');window.location='index.jsp?page=Login';</script>");
        
   }
    %>
    <body>
        <center>
            
                <span style="font-size: 20px;color: #343434;">Book Tour</span>
            <form method="post" id="bookTour" action="ControllerConfBookTour" >
                <table width="490px" style="background-color: #f7f6f6">
                    
                    <tr>
                        <td>
                            <table border="0" style="">                                
                                <tr>
                                    <td>
                                        <input type="hidden" id="users"  name="users" value="<%=user%>"/>
                                    </td>
                                    <td align="left"></td>
                                </tr>
                                <tr>
                                    <td align="left" colspan="2"><b>TOUR COST:</b></td>
                                </tr>
                                <tr>
                                    <td align="left">Tour name </td>
                                    <td align="left"><label style="font-size:12px;"><b><%=nametour%></b></label></td>
                                </tr>
                                <tr>
                                    <td align="left">Adult price </td>
                                    <td align="left">
                                        <label><b><f:formatNumber value="<%=pirceAdult%>" pattern="$#,###"/></b></label>
                                    </td>
                                </tr>
                                <tr>
                                    <td align="left">Child price</td>
                                    <td align="left">  <label><b><f:formatNumber value="<%=priceChild%>" pattern="$#,###"/></b></label>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="left">(Children under 12 years old)</td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="left">(Children aged 12 years and older: charged as adults)</td>
                                </tr>
                                
                                <tr>
                                    <td colspan="2" align="left">
                                        <input type="hidden" id="nametour" name="nametour" value="<%=nametour%>"/>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="left"><strong>PLEASE CHOOSE DATE TO BOOK :</strong></td>
                                </tr>
                                <tr>
                                    <td align="left">Start date of traveling </td>
                                    <td align="left">
                                        <input type="text" id="startdate" name="startdate" readonly="true"/>
                                        <img src="images/cal.gif" onclick="javascript:NewCssCal('startdate','ddMMyyyy')" style="cursor:pointer"/>
                                    <span id="startdateInfor"> Choose date </span>				</td>
                                </tr>
                                <tr>
                                    <td align="left">End date of traveling </td>
                                    <td align="left">
                                        <input type="text" id="enddate" name="enddate" readonly="true"/>
                                        <img src="images/cal.gif" onclick="javascript:NewCssCal('enddate','ddMMyyyy')" style="cursor:pointer"/>
                                    <span id="enddateInfor"> End date</span>				</td>
                                </tr>
                                <tr>
                                    <td align="left">Number of adults traveling  </td>
                                    <td align="left">
                                        <select name="opadult">
                                            
                                            <option value="1">1</option>
                                            <option value="2">2</option>
                                            <option value="3">3</option>
                                            <option value="4">4</option>
                                            <option value="5">5</option>
                                            <option value="6">6</option>
                                            <option value="7">7</option>
                                            <option value="8">8</option>
                                            <option value="9">9</option>
                                            <option value="10">10</option>
                                            <option value="11">11</option>
                                            <option value="12">12</option>
                                            <option value="13">13</option>
                                            <option value="14">14</option>
                                            <option value="15">15</option>
                                            <option value="16">16</option>
                                            <option value="17">17</option>
                                            <option value="18">18</option>
                                            <option value="19">19</option>
                                            <option value="20">20</option>
                                            <option value="21">21</option>
                                            <option value="22">22</option>
                                            <option value="23">23</option>
                                            <option value="24">24</option>
                                            <option value="25">25</option>
                                            <option value="26">26</option>
                                            <option value="27">27</option>
                                            <option value="28">28</option>
                                            <option value="29">29</option>
                                            <option value="30">30</option>
                                            <option value="31">31</option>
                                            <option value="32">32</option>
                                            <option value="33">33</option>
                                            <option value="35">34</option>
                                            <option value="35">35</option>
                                            <option value="36">36</option>
                                            <option value="37">37</option>
                                            <option value="38">38</option>
                                            <option value="39">39</option>
                                            <option value="40">40</option>
                                        </select>
                                    <span id="opAdulInfor"> Choose number </span>				</td>
                                </tr>
                                
                                <tr>
                                    <td align="left">Number of children traveling  </td>
                                    <td align="left">
                                        <select name="opchild">
                                            <option value="0">0</option>
                                            <option value="1">1</option>
                                            <option value="2">2</option>
                                            <option value="3">3</option>
                                            <option value="4">4</option>
                                            <option value="5">5</option>
                                            <option value="6">6</option>
                                            <option value="7">7</option>
                                            <option value="8">8</option>
                                            <option value="9">9</option>
                                            <option value="10">10</option>
                                            <option value="11">11</option>
                                            <option value="12">12</option>
                                            <option value="13">13</option>
                                            <option value="14">14</option>
                                            <option value="15">15</option>
                                            <option value="16">16</option>
                                            <option value="17">17</option>
                                            <option value="18">18</option>
                                            <option value="19">19</option>
                                            <option value="20">20</option>
                                            <option value="21">21</option>
                                            <option value="22">22</option>
                                            <option value="23">23</option>
                                            <option value="24">24</option>
                                            <option value="25">25</option>
                                            <option value="26">26</option>
                                            <option value="27">27</option>
                                            <option value="28">28</option>
                                            <option value="29">29</option>
                                            <option value="30">30</option>
                                            <option value="31">31</option>
                                            <option value="32">32</option>
                                            <option value="33">33</option>
                                            <option value="35">34</option>
                                            <option value="35">35</option>
                                            <option value="36">36</option>
                                            <option value="37">37</option>
                                            <option value="38">38</option>
                                            <option value="39">39</option>
                                            <option value="40">40</option>
                                        </select>			
                                        <span id="opChilInof"> Choose number (Children under 12 years old)</span>	
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="center">
                                        <input id="idtour" name="idtour" value="<%=idtour%>" type="hidden"/>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="left"><b>PAYMENT METHOD :</b></td>
                                </tr>
                                <tr>
                                    <td colspan="2" style="color:#CC3333" align="left">Note: You can choose or not the cash. </td>
                                </tr>
                                <tr>
                                    <td align="left">Choose card:</td>
                                    <td align="left">
                                        <select name="methodPay">
                                            <option value="Not cash">Not cash</option>
                                            <option value="The cash">The cash</option>
                                            <option value="The Visa">The Visa</option>
                                            <option value="The Mastercard">The Mastercard</option>                                         
                                            
                                        </select>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2"><input id="ap" name="ap" type="hidden" readonly="true" value="<%=pirceAdult%>"/></td>
                                </tr>
                                <tr>
                                    <td colspan="2"><input id="cp" name="cp" type="hidden" value="<%=priceChild%>"/> </td>
                                </tr>
                                
                                <tr>
                                    <td colspan="2" align="center">
                                        <input type="submit" name="send" value="Book now" id="send" style="border:none;width:120px;height:22px;padding-bottom:2px;font-weight:bold;text-align:center;margin:0px 10px;font-size:15px;background-image:url(skinImgTuor/btnSmall.jpg);color: #fff;"/>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="center"></td>
                                </tr>
                                <tr>
                                    <td colspan="2" align="center"></td>
                                </tr>
                                
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="left" style="color:#CC3333"><b>Note :</b> After you finished book here, We will call to you in 24 h </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="left" style="color:#CC3333">Please show details and price of the flights before </td>
                    </tr>
                </table>
                
            </form>
        </center>

    </body>    
</html>